body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
.el-checkbox__label {
	color: #FFF;
}

.el-menu-vertical-demo {
	.logo {
		span {
			color: #fff;
		}
	}
}

.mavon-editor-box * {
	// color: #666;
	color: #fff !important;
}

.router-link-active {
	color: #fff;
}

.el-message-box__message p {
	color: #333;
}

body,
html {
	// background: #1F2128;
	background: #1A1E2C;

	.header-box {
		background-color: rgba(#141722, 1);
	}
}

.el-menu-item {
	&:hover {
		background: #141722;
	}
}

#app {
	.layout {
		// background: #1F2128;
		background: #1A1E2C;
	}

	// .layout-content,
	.markdown-box,
	// .detail-box,
	.slot,
	// .info-item,
	.detail-layout,
	.el-dialog,
	// .el-pager li,
	// .el-table th,
	// .el-table tr,
	.el-drawer,
	.table-layout,
	.menu-box,
	// .alike-lis li .alike-lis-box,
	.has-vers-lis li,
	.has-vers-lis .ver-table,
	// .el-table__empty-block,
	.el-tree,
	.el-tree-node__content:hover,
	.el-upload-list__item:hover,
	.is-focusable.el-tree-node.is-expanded.is-current,
	.is-focusable:active,
	.is-focusable:visited,
	// .el-input-group__append,
	.el-input-group__prepend,
	.el-tree-node:focus>.el-tree-node__content,
	.el-pagination.is-background .btn-next,
	.el-pagination.is-background .btn-prev,
	.el-pagination.is-background .el-pager li {
		// background: #242730;
		// background: #242730 !important;
		background: #202432;
	}

	.el-input-group__append {
		background: transparent;
		width: auto;
		border: 0;
		padding: 0 15px;

		.short-append {
			text-align: left;
			color: #A4ADCD !important;
		}
	}

	.pagination-box {
		.el-input__inner {
			border: 1px solid rgba(#fff, .2) !important;
		}

		.el-pager {
			li {
				border: 1px solid rgba(#fff, .2);
			}

			.active {
				background: #177DDC !important;
				border: 1px solid #177DDC;
			}
		}
	}

	.alike-lis li .alike-lis-box {
		background: #0D0E15;

		&:hover {
			background: #353B69;
		}
	}

	.alike-lis-both {
		.lis-both-item {
			// background: #242730 !important;
			// background: #202432 !important;
		}
	}

	.mavon-look-box .v-show-content.scroll-style.scroll-style-border-radius {
		// background: #1A1A1A !important;
		// background: #242730 !important;
		background: #171C2B !important;
	}

	.el-pagination.is-background .btn-next.disabled,
	.el-pagination.is-background .btn-next:disabled,
	.el-pagination.is-background .btn-prev.disabled,
	.el-pagination.is-background .btn-prev:disabled,
	.el-pagination.is-background .el-pager li.disabled,
	.el-step__title.is-process {
		color: #606266;
	}

	.el-transfer {

		.el-transfer-panel,
		.el-transfer-panel__header {
			background: #333B54 !important;
			border: 1px solid #4A567E !important;
		}

		.el-transfer-panel__header {

			* {
				color: #fff !important;
			}

			.el-checkbox {
				margin: 0;
			}
		}

		.el-transfer-panel__list {
			&::-webkit-scrollbar {
				width: 12px;
			}

			/* 滚动槽 */
			&::-webkit-scrollbar-track {
				box-shadow: inset006pxrgba(0, 0, 0, 0.3);
				border-radius: 10px;
			}

			/* 滚动条滑块 */
			&::-webkit-scrollbar-thumb {
				border-radius: 10px;
				background: rgba(0, 0, 0, 0.1);
				box-shadow: inset006pxrgba(0, 0, 0, 0.5);
			}

			&::-webkit-scrollbar-thumb:window-inactive {
				background: rgba(0, 0, 0, .06);
			}
		}
	}

	// .el-dropdown-link {
	// 	border: 1px solid rgba(#808080, .5);
	// 	background: rgba(#808080, 1);
	// }

	.tabs-box {
		.el-tabs__nav-wrap {
			background-color: transparent;

			.el-tabs__header {
				border: 0;
			}

			&::after {
				height: 0;
			}

			.el-tabs__nav-scroll {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: space-between;

				.el-tabs__item {
					// font-size: 1.1875rem;
					text-align: center;
					line-height: 3.375rem;
				}

				.is-active {
					color: #d3ff00;
					border: 0 !important;
					height: 5px;
					background-color: #d3ff00;
					top: 0;
				}

				.el-tabs__active-bar {
					height: 5px;
					background-color: #d3ff00;
					top: 0;
				}
			}
		}

		.el-tabs__item {
			color: #F1F1F1;
		}

		.el-tabs__item.is-active {
			color: #409EFF;
		}
	}

	.tabs-left {
		padding: 0 20px;

		.el-tabs__nav-wrap {

			&::after {
				width: 100%;
				height: 1px;
				background-color: #4E5776 !important;
			}
		}

		.el-tabs__item {
			text-align: center;
			color: #A4ADCD;
			font-size: 14px;
			margin: 0;
			padding: 0 20px;

			&.is-active {
				color: #019AFF;
			}
		}
	}

	.none-type,
	.el-input__inner,
	.el-textarea__inner,
	.drop-box,
	.el-steps--simple {
		background: #333B54;
		border-color: #4A567E;
		color: #B8C2E5 !important;
	}

	.el-input,
	.el-textarea,
	.el-cascader__dropdown,
	.el-select-dropdown {
		overflow: hidden;
	}

	.el-input-number {

		.el-input-number__decrease,
		.el-input-number__increase {
			background: #202432;
			border-color: #4A567E;
		}

		.input__inner {
			border: 0;
		}
	}

	.el-radio-button__inner {
		background: #333B54;
		color: #B8C2E5;
		border: 0;
		box-shadow: 0 0 0 transparent;

		&:hover {
			color: #FFF;
		}
	}

	.el-radio-button__orig-radio:checked+.el-radio-button__inner {
		background: #4A567E;
		color: #FFF;
		border: 0;
		box-shadow: 0 0 0 transparent;
	}

	.has-vers-lis .lis-header .lis-header-name span,
	.handle-btn-hollow,
	.code-layout .state-title,
	.info-title,
	.outin-handle a,
	.el-form-item__label,
	.el-dialog__title,
	.info-item-name {
		color: #F1F1F1;
	}

	.has-ver-table-layout *,
	.lis-header * {
		// background: #242730 !important;
		// background: #202432 !important;
	}

	.has-vers-lis .lis-header {
		background: transparent;
	}

	.code-layout.content-detail,
	.node-module,
	.el-table--enable-row-hover .el-table__body tr:hover>td,
	.has-vers-lis .lis-header {
		// background: rgba(0, 119, 255, 0.06);
		background: #202432 !important;
	}

	.podUrl-box {
		.info-item {
			background: transparent;
		}
	}

	.home-monitoring {
		li {
			// background: #242730;
			background: #202432;

			.name {
				color: #F1F1F1;
			}
		}
	}

	.mavon-editor-box {

		.v-note-op,
		.dropdown-item,
		.v-note-edit,
		.content-input-wrapper,
		.auto-textarea-input,
		.v-show-content,
		.v-note-panel {
			background: #171C2B !important;
			color: #fff !important;
		}
	}

	.table-data {
		background: #202432;
	}

	.el-menu {
		background: transparent;

		.menu-icon::before {
			background: #a4adcd;
		}

		.is-active {
			background: transparent;

			.menu-icon::before {
				background: #d3ff00;
			}
		}
	}

	.el-menu--vertical {
		background: #212635 !important;
	}

	.el-menu-item-group {
		background: #212635 !important;
	}

	.menu {
		background: #2c3246;
		// background: #212635;

		.el-menu-item-group {
			background: #212635 !important;

			* {
				background: #212635;
			}

			.menu-icon::before {
				background: #d3ff00;
			}
		}


		li {
			color: #FFF;

			&::before {
				// background: #FFF;
			}
		}
	}

	.el-menu {
		z-index: 9999;

		.el-menu-item * {
			color: #8492C2 !important;
		}

		.is-active {
			background: #212637;

			* {
				color: #019AFF !important;
			}
		}
	}

	.page-title,
	.el-radio {
		color: #FFF;
	}

	.content {
		&::-webkit-scrollbar-thumb:window-inactive {
			background: rgba(255, 255, 255, .3);
		}
	}

	.network-in,
	.network-out {
		background: rgba(255, 255, 255, .3);

		span {
			color: #F1F1F1;
		}
	}

	.has-color.el-table th {
		background: rgba(255, 255, 255, 0);
	}

	.has-color.el-table td {
		background: rgba(255, 255, 255, .2);
	}

	.has-color.el-table .has-color-header {
		background: #e0e6ee;

		.cell {
			color: #3383b6;
		}
	}

	.el-breadcrumb {
		.el-breadcrumb__item {
			.el-breadcrumb__inner {
				color: #FFF;
			}
		}
	}
}

.logo {
	.img {
		background: url(~@/assets/img/logo.png) no-repeat !important;
		background-size: 100% !important;
	}
}

.markdown-box *,
.code-materials *,
.el-textarea *,
.el-table *,
.el-collapse-item * {
	// background: #242730 !important;
	// background: #202432 !important;
}

:deep(.el-radio-group) {
	.el-radio-button__inner {
		background: #333B54 !important;
		border-color: #4A567E !important;
		color: #B8C2E5 !important;
	}
}

.el-radio {
	.el-radio__label {
		color: #A4ADCD;
	}

	&.is-checked {
		.el-radio__label {
			color: #fff !important;
		}
	}
}

.is-active .el-radio-button__inner {
	background: rgba(132, 146, 194, 1) !important;
}

// /deep/ .el-radio-button__orig-radio:checked+.el-radio-button__inner {
// 	background: rgba(132, 146, 194, 1) !important;
// 	color: rgba(255, 255, 255, 1) !important;
// 	border: 1px solid rgba(132, 146, 194, 1) !important;
// }

.markdown-box * {

	.v-note-panel {

		color: #fff !important;
	}
}

.large-icon {

	li {
		.name {
			color: #FFF;
		}
	}
}

.search-box {
	.el-button {
		border: 0;
		color: #fff;
		background: #808080;
	}
}

body {
	.el-popover {
		color: #fff;
		background: #0D0E15;
		border: 1px solid #2A2E46;

		.breviary-title {
			color: #8492C2;
		}

		.breviary-detail {
			color: #fff;
		}
	}

	.el-popper[x-placement^=right] .popper__arrow {

		// border-right-color: #242730;
		&::after {
			// border-right-color: #242730;
			border-right-color: #0D0E15;
		}
	}

	.el-cascader-menu,
	.el-select-dropdown {
		// background: #242730;
		background: #2C3246;
		border: 1px solid #3E476C;
	}

	.el-select-dropdown__item {
		color: #A4ADCD;
	}

	.el-cascader-node:not(.is-disabled):focus,
	.el-cascader-node:not(.is-disabled):hover,
	.el-select-dropdown__item.hover,
	.el-select-dropdown__item:hover {
		background: #54618B;
		// border: 1px solid #3E476C;
	}

	.add-alike-title {
		border-bottom: 1px solid #4A567E;
	}

	.el-popper[x-placement^=bottom] .popper__arrow {

		&::after {
			// border-bottom-color: #242730;
			border-bottom-color: #0D0E15;
		}
	}

	.el-popper[x-placement^=left] .popper__arrow {

		&::after {
			// border-left-color: #242730;
			border-left-color: #0D0E15;
		}
	}

	.el-popper[x-placement^=top] .popper__arrow {

		&::after {
			// border-top-color: #242730;
			border-top-color: #0D0E15;
		}
	}

	.branch .is-active {
		background: rgba(0, 0, 0, 0) !important;
	}

	.el-submenu.is-active .el-submenu__title {
		border-bottom-color: rgba(0, 0, 0, 0);
	}

	.branch .is-active {
		background: rgba(0, 0, 0, 0);
	}

	.el-dropdown-menu {
		background: #333;

		.el-dropdown-menu__item {
			&:hover * {
				color: #333;
			}
		}
	}

}

.code-layout {
	.info-item {
		li {
			border-bottom: 1px solid rgba(#eee, .1) !important;
		}
	}

	.list-box {
		border-right: 1px solid rgba(#eee, .2) !important;

		.metrice-list-box {
			margin-top: 20px;

			.title {
				border-bottom: 1px solid rgba(#eee, .2) !important;
			}
		}
	}
}

.drawer-box {
	// background: #242730;
	background: #202432;
	box-shadow: 5px 0 10px rgba(#000, .1);

	.infinite-list {
		// background: #242730 !important;
		background: #202432 !important;
		padding: 10px 20px;

		.infinite-item {
			border: 1px solid #333;
			border-radius: 5px;
			overflow: hidden;
			margin: 10px 0;
			height: 90px;
			display: flex;
			position: relative;

			.infinite-item-left {
				// width: 50px;
				width: 30px;
			}

			.tag {
				position: absolute;
				bottom: 10px;
				right: 10px;
			}

			.infinite-item-center {
				width: 55%;
			}

			.infinite-item-right {
				width: 45%;
			}
		}

		.infinite-item.is-active {
			background: #5A658E;

			.title {
				color: #fff !important;
			}

			.desc {
				color: #eee !important;
			}
		}

		.title {
			color: #dce0ee !important;
		}

		.desc {
			color: #a4adcd !important;
			width: 100%;
			display: -webkit-inline-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			overflow: hidden;
			white-space: normal;
		}

		.tag {
			display: flex;
			align-items: flex-end;
			justify-content: flex-end;

			* {
				margin-right: 5px;

				&:last-child {
					margin: 0;
				}
			}
		}
	}
}

.drawer-box-table {
	// background: #242730;
	background: #202432;
}

.header-box {
	// background: #242730;
	background: #202432;

	.user .text {
		color: #fff;
	}

	.user-box {
		.avatar {
			background: url(~@/assets/img/user-avatar-dark.svg) no-repeat;
			background-size: 100%;
		}
	}
}

.dropdown {
	background: #2C3246 !important;
	border: 1px solid #3E476C !important;
	padding: 2px;

	.el-dropdown-menu__item {
		color: #A4ADCD !important;
	}

	body .el-popper[x-placement^=bottom] .popper__arrow::after {
		border-bottom-color: #2C3246 !important;
	}

	.el-dropdown-menu__item:hover {
		background: #54618B;

		span {
			color: #A4ADCD !important;
		}
	}
}

.avatar {
	background: url(~@/assets/img/user-avatar-dark.svg) no-repeat;
	background-size: 100%;
}

.el-table td,
.el-table th {
	border-bottom: 1px solid rgba(#9AAFF9, .19) !important;
}

.el-table th {
	background: #202432 !important;

	.cell {
		color: #707BA3;
	}
}

.el-table__empty-block,
.el-table tr {
	background: #1A1E2C !important;
}

.el-table::before {
	// background: rgba(#eee, .3) !important;
	background: transparent;
}

.menu-icon1 {
	content: url(~@/assets/img/icon/menu-icon1-dark.svg);
}

.menu-icon2 {
	content: url(~@/assets/img/icon/menu-icon2-dark.svg);
}

.menu-icon3 {
	content: url(~@/assets/img/icon/menu-icon3-dark.svg);
}

.menu-icon4 {
	content: url(~@/assets/img/icon/menu-icon4-dark.svg);
}

.menu-icon5 {
	content: url(~@/assets/img/icon/menu-icon5-dark.svg);
}

.menu-icon6 {
	content: url(~@/assets/img/icon/menu-icon6-dark.svg);
}

.menu-icon7 {
	content: url(~@/assets/img/icon/menu-icon7-dark.svg);
}

.menu-icon8 {
	content: url(~@/assets/img/icon/menu-icon8-dark.svg);
}

.menu-icon9 {
	content: url(~@/assets/img/icon/menu-icon9-dark.svg);
}

.menu-icon10 {
	content: url(~@/assets/img/icon/menu-icon10-dark.svg);
}

.menu-icon11 {
	content: url(~@/assets/img/icon/menu-icon11-dark.svg);
}

// .menu-icon11-1 {
// 	content: url(~@/assets/img/icon/menu-icon11-1-dark.svg);
// }

.menu-icon12 {
	content: url(~@/assets/img/icon/menu-icon12-dark.svg);
}

.menu-icon13 {
	content: url(~@/assets/img/icon/menu-icon13-dark.svg);
}

.is-active {
	.menu-icon1 {
		content: url(~@/assets/img/icon/menu-icon1-dark-active.svg);
	}

	.menu-icon2 {
		content: url(~@/assets/img/icon/menu-icon2-dark-active.svg);
	}

	.menu-icon3 {
		content: url(~@/assets/img/icon/menu-icon3-dark-active.svg);
	}

	.menu-icon4 {
		content: url(~@/assets/img/icon/menu-icon4-dark-active.svg);
	}

	.menu-icon5 {
		content: url(~@/assets/img/icon/menu-icon5-dark-active.svg);
	}

	.menu-icon6 {
		content: url(~@/assets/img/icon/menu-icon6-dark-active.svg);
	}

	.menu-icon7 {
		content: url(~@/assets/img/icon/menu-icon7-dark-active.svg);
	}

	.menu-icon8 {
		content: url(~@/assets/img/icon/menu-icon8-dark-active.svg);
	}

	.menu-icon9 {
		content: url(~@/assets/img/icon/menu-icon9-dark-active.svg);
	}

	.menu-icon10 {
		content: url(~@/assets/img/icon/menu-icon10-dark-active.svg);
	}

	.menu-icon11 {
		content: url(~@/assets/img/icon/menu-icon11-dark-active.svg);
	}

	.menu-icon12 {
		content: url(~@/assets/img/icon/menu-icon12-dark-active.svg);
	}

	.menu-icon13 {
		content: url(~@/assets/img/icon/menu-icon13-dark-active.svg);
	}

}

.el-tabs__nav-wrap {
	.el-tabs__item {
		font-size: 16px;
		color: rgba(164, 173, 205, 1);
	}

	.el-tabs__nav-scroll {
		padding: 0 15px;
	}

	&:after {
		height: 1px !important;
		background: rgba(78, 87, 118, 1) !important;
	}
}

.el-message-box__message p {
	color: black;
}

/deep/ .el-table__expanded-cell{
	background: #202432;
}

/deep/ .el-table__expand-icon{
	color: #fff;
}
